<!DOCTYPE html>
<html lang="en"  xmlns:th="http://www.thymeleaf.org">
<head>

    <title>项目立项信息显示页面</title>

    <div th:replace="common/common.html :: common_resource"></div>

</head>

<body class="gray-bg">
<div class="wrapper wrapper-content animated fadeInRight">

    <div class="row" id="nowBody">
        <div class="col-sm-12">
            <div class="ibox float-e-margins">
                <div class="ibox-title">
                    <h5>项目立项信息表格</h5>
                    <div class="ibox-tools">
                        <a class="collapse-link">
                            <i class="fa fa-chevron-up"></i>
                        </a>
                        <a class="dropdown-toggle" data-toggle="dropdown" href="project_list.html#">
                            <i class="fa fa-wrench"></i>
                        </a>
                    </div>
                </div>
                <!-- 3D立体按钮在button的class中加入 dim -->
                <div class="ibox-content" >
                    <div class="row" style="margin-bottom:10px">
                        <!--                            <div class="col-sm-2 m-b-xs">-->
                        <!--                                <a data-toggle="modal" href="project_list.html#modal-form" onclick="addForm()">-->
                        <!--                                    <button style="width:120px" class="btn btn-outline btn-primary" type="button">-->
                        <!--                                        <i class="fa fa-plus"></i> 新增项目-->
                        <!--                                    </button>-->
                        <!--                                </a>-->
                        <!--                            </div>-->
                        <div class="col-sm-3">
                            <div class="input-group">
                                <input style="height:35px;" type="text" placeholder="请输入项目编号" id="keywords"
                                       th:value="${session.projectId}"
                                       class="input-sm form-control">
                                <span class="input-group-btn">
                                        <button style="height:35px;width:80px;" type="button" class="btn btn-sm btn-primary"
                                                href="javascript:;" onclick="query()"> 搜索</button>
                                    </span>
                            </div>
                        </div>
                        <script type="text/javascript">
                            // 模糊查询
                            function query() {
                                window.location.href = "/project/findProject?projectId=" + $("#keywords").val() + "";
                            }
                        </script>
                    </div>
                    <div class="table-responsive">
                        <table class="table table-bordered table-hover" >
                            <thead>
                            <tr style="size:24px;height:60px">
                                <th style="text-align:center;width:15%">项目编号</th>
                                <th style="text-align:center;width:10%">项目名称</th>
                                <th style="text-align:center;width:7%">项目类型</th>
                                <th style="text-align:center;width:8%">团队名称</th>
                                <th style="text-align:center;width:7%">个人/队长的姓名</th>
                                <th style="text-align:center;width:8%">指导老师</th>
                                <th style="text-align:center;width:10%">项目状态</th>
                                <th style="text-align:center;width:15%">经费预算</th>
                                <th style="text-align:center;width:20%">操作</th>
                            </tr>
                            </thead>
                            <tbody style="text-align:center;size:18px">
                            <tr th:each="project : ${projectList}">
                                <td th:text="${project.projectId}">项目编号</td>
                                <td th:text="${project.projectName}">项目名称</td>
                                <span th:switch="${project.projectState eq 1}">
                                    <td th:case="true" th:text="团队项目">团队编号</td>
                                    <td th:case="false" th:text="个人项目">团队编号</td>
                                </span>

                                <span th:if="${project.teamId ne null}">
                                    <span th:each="team : ${teamList}">
                                        <td th:if="${team.teamId eq project.teamId}" th:text="${team.teamName}">团队编号</td>
                                    </span>
                                </span>
                                <span th:if="${project.teamId eq null or project.teamId eq ''}">
                                    <td th:text="无">个人编号</td>
                                </span>

                                <span th:if="${project.stuNo ne null}">
                                    <span th:each="student : ${studentList}">
                                        <td th:if="${student.stuNo eq project.stuNo}" th:text="${student.stuName}">个人编号</td>
                                    </span>
                                </span>
                                <span th:if="${project.stuNo eq null or project.stuNo eq ''}">
                                    <td th:text="无">个人编号</td>
                                </span>

                                <span th:each="instructor : ${instructorList}">
                                    <td th:if="${instructor.instructorId eq project.instructorId}" th:text="${instructor.instructorName}">指导老师</td>
                                </span>

                                <span th:if="${project.approvalStateOne eq null and project.approvalStateTwo eq null}">
                                    <td style="color:darkorange" th:text="指导老师审批中">审批状态</td>
                                </span>
                                <span th:if="${project.approvalStateOne eq 1 and project.approvalStateTwo eq null}">
                                    <td style="color:coral" th:text="指导老师通过">审批状态</td>
                                </span>
                                <span th:if="${project.approvalStateOne eq 2 and project.approvalStateTwo eq null}">
                                    <td style="color:red" th:text="指导老师拒批">审批状态</td>
                                </span>
                                <span th:if="${project.approvalStateOne eq 1 and project.approvalStateTwo eq 1}">
                                    <td style="color:deepskyblue" th:text="已全部审核">审批状态</td>
                                </span>
                                <span th:if="${project.approvalStateOne eq 1 and project.approvalStateTwo eq 2}">
                                    <td style="color:red" th:text="学院部门拒批">指导老师拒批</td>
                                </span>
                                <td>
                                    <a data-toggle="modal" href="funds_list.html#modal-form-funds"
                                       th:data-projectId="${project.projectId}"
                                       onclick="editFormFunds(this.getAttribute('data-projectId'))">
                                        <button style="margin-top:10px" class="btn btn-outline btn-success" type="button">
                                            <i class="fa fa-paste"></i> 预算详情
                                        </button>
                                    </a>
                                </td>
                                <td th:if="${(session.role.roleId eq '1004' and (session.teamStuNo == 1 or session.teamStuNo == 2)) or session.role.roleId eq '1001'}">
                                    <a data-toggle="modal" href="project_list.html#modal-form"
                                       th:data-projectId="${project.projectId}"
                                       th:data-projectName="${project.projectName}"
                                       th:data-projectState="${project.projectState}"
                                       th:data-teamId="${project.teamId}"
                                       th:data-stuNo="${project.stuNo}"
                                       th:data-instructorId="${project.instructorId}"
                                       th:data-approvalStateOne="${project.approvalStateOne}"
                                       th:data-evaluateStateOne="${project.evaluateStateOne}"
                                       th:data-approvalStateTwo="${project.approvalStateTwo}"
                                       th:data-evaluateStateTwo="${project.evaluateStateTwo}"
                                       th:data-stateNow="${project.stateNow}"
                                       onclick="editForm(this.getAttribute('data-projectId'),
                                               this.getAttribute('data-projectName'),
                                               this.getAttribute('data-projectState'),
                                               this.getAttribute('data-teamId'),
                                               this.getAttribute('data-stuNo'),
                                               this.getAttribute('data-instructorId'),
                                               this.getAttribute('data-approvalStateOne'),
                                               this.getAttribute('data-evaluateStateOne'),
                                               this.getAttribute('data-approvalStateTwo'),
                                               this.getAttribute('data-evaluateStateTwo'),
                                               this.getAttribute('data-stateNow'))">
                                        <button style="margin-top:10px" class="btn btn-outline btn-success" type="button">
                                            <i class="fa fa-paste"></i> 详情
                                        </button>
                                    </a>
                                    <a th:if="${((session.role.roleId eq '1004' and (session.teamStuNo == 1 or session.teamStuNo == 2)) and project.stateNow == 2) or session.role.roleId eq '1001'}"
                                       th:href="@{/project/deleteProject(projectId = ${project.projectId})}">
                                        <button style="margin-top:10px" class="btn btn-outline btn-danger " type="button" >
                                            <i class="fa fa-warning"></i> 删除
                                        </button>
                                    </a>
                                </td>
                                <td th:if="${session.role.roleId eq '1002' or session.role.roleId eq '1003'}">
                                    <a data-toggle="modal" href="project_list.html#modal-form"
                                       th:data-projectId="${project.projectId}"
                                       th:data-projectName="${project.projectName}"
                                       th:data-projectState="${project.projectState}"
                                       th:data-teamId="${project.teamId}"
                                       th:data-stuNo="${project.stuNo}"
                                       th:data-instructorId="${project.instructorId}"
                                       th:data-approvalStateOne="${project.approvalStateOne}"
                                       th:data-evaluateStateOne="${project.evaluateStateOne}"
                                       th:data-approvalStateTwo="${project.approvalStateTwo}"
                                       th:data-evaluateStateTwo="${project.evaluateStateTwo}"
                                       th:data-stateNow="${project.stateNow}"
                                       onclick="editForm(this.getAttribute('data-projectId'),
                                               this.getAttribute('data-projectName'),
                                               this.getAttribute('data-projectState'),
                                               this.getAttribute('data-teamId'),
                                               this.getAttribute('data-stuNo'),
                                               this.getAttribute('data-instructorId'),
                                               this.getAttribute('data-approvalStateOne'),
                                               this.getAttribute('data-evaluateStateOne'),
                                               this.getAttribute('data-approvalStateTwo'),
                                               this.getAttribute('data-evaluateStateTwo'),
                                               this.getAttribute('data-stateNow'))">
                                        <button style="margin-top:10px" class="btn btn-outline btn-success" type="button">
                                            <i class="fa fa-paste"></i> 详情
                                        </button>
                                    </a>
                                    <!-- 学院部门审批 -->
                                    <a th:if="${session.role.roleId eq '1002' and project.approvalStateTwo eq null}"
                                       data-toggle="modal" href="project_list.html#modal-form-approval"
                                       th:data-projectId="${project.projectId}"
                                       onclick="approvalForm(this.getAttribute('data-projectId'), '1002')">
                                        <button style="margin-top:10px" class="btn btn-outline btn-danger" type="button">
                                            <i class="fa fa-warning"></i> 拒批
                                        </button>
                                    </a>
                                    <a th:if="${session.role.roleId eq '1002' and project.approvalStateTwo eq null}"
                                       th:href="@{/project/addEditProject(projectId = ${project.projectId}, keyNow = 9)}">
                                        <button style="margin-top:10px" class="btn btn-outline btn-warning " type="button" >
                                            <i class="fa fa-paste"></i> 审批
                                        </button>
                                    </a>
                                    <!-- 指导老师审批 -->
                                    <a th:if="${session.role.roleId eq '1003' and project.approvalStateOne eq null}"
                                       data-toggle="modal" href="project_list.html#modal-form-approval"
                                       th:data-projectId="${project.projectId}"
                                       onclick="approvalForm(this.getAttribute('data-projectId'), '1003')">
                                        <button style="margin-top:10px" class="btn btn-outline btn-danger" type="button">
                                            <i class="fa fa-warning"></i> 拒批
                                        </button>
                                    </a>
                                    <a th:if="${session.role.roleId eq '1003' and project.approvalStateOne eq null}"
                                       th:href="@{/project/addEditProject(projectId = ${project.projectId}, keyNow = 8)}">
                                        <button style="margin-top:10px" class="btn btn-outline btn-warning " type="button" >
                                            <i class="fa fa-paste"></i> 审批
                                        </button>
                                    </a>
                                </td>
                            </tr>
                            </tbody>
                        </table>
                        <div class="col-sm-6">
                            <div style="size:18px" class="dataTables_info" id="editable_info" role="alert" aria-live="polite" aria-relevant="all">
                                显示 <span th:text="(${page.current}-1)*6+1"/> 到 <span th:text="${page.current*6}"/> 项, 共 <span th:text="${numberPages}"/> 项
                            </div>
                        </div>
                        <div class="col-sm-6">
                            <div class="dataTables_paginate paging_simple_numbers" id="editable_paginate">
                                    <span class="pagination">
                                        <!--
                                              gt：great than（大于）
                                              ge：great equal（大于等于）
                                              eq：equal（等于）
                                              lt：less than（小于）
                                              le：less equal（小于等于）
                                              ne：not equal（不等于）
                                        -->
                                        <li class="paginate_button previous" aria-controls="editable" tabindex="0" id="editable_start">
                                            <a th:href="@{/project/findProject(pageNumber = 1)}">首页</a>
                                        </li>
                                        <li class="paginate_button previous" aria-controls="editable" tabindex="0" id="editable_previous"
                                            th:switch="${page.current} gt 1">
                                            <a th:case="true" th:href="@{/project/findProject(pageNumber = ${page.current}-1)}">上一页</a>
                                            <a th:case="false" th:href="@{javascript:alert('已经是第一页')}">上一页</a>
                                        </li>
                                        <li class="paginate_button active disabled" aria-controls="editable" tabindex="0" th:if="${page.current} gt 3">
                                            <span>...</span>
                                        </li>
                                    </span>
                                <span class="pagination" th:each="status,iterStat:${pagesList}"
                                      th:switch="${page.current eq iterStat.count}">
                                        <li class="paginate_button active disabled" aria-controls="editable" tabindex="0" th:case="true">
                                            <span th:text="${iterStat.count}"></span>
                                        </li>
                                        <li class="paginate_button" aria-controls="editable" tabindex="0" th:case="false" th:if="${page.current} ne ${iterStat.count}">
                                            <a th:if="${page.current + 2 >= iterStat.count && page.current - 2 <= iterStat.count}"
                                               th:href="@{/project/findProject(pageNumber = ${iterStat.count})}">
                                                <span th:text="${iterStat.count}"></span>
                                            </a>
                                        </li>
                                    </span>
                                <span class="pagination">
                                        <li class="paginate_button active disabled" aria-controls="editable" tabindex="0" th:if="${pages - page.current} gt 2">
                                            <span>...</span>
                                        </li>
                                        <li class="paginate_button next" aria-controls="editable" tabindex="0" id="editable_end"
                                            th:switch="${page.current} lt ${pages}">
                                            <a th:case="true" th:href="@{/project/findProject(pageNumber = ${page.current}+1)}">下一页</a>
                                            <a th:case="false" th:href="@{javascript:alert('已经是最后一页')}">下一页</a>
                                        </li>
                                        <li >
                                            <a th:href="@{/project/findProject(pageNumber = ${pages})}">尾页</a>
                                        </li>
                                    </span>
                                </ul>
                            </div>
                        </div>
                    </div>

                </div>
            </div>
        </div>

    </div>
</div>

<div th:include="project/project_add.html :: addProject"></div>

<!-- 审批界面 -->
<div th:include="project/approval_add.html :: addProject"></div>

<!-- 预算详情 -->
<div th:include="funds/funds_add.html :: addFunds"></div>

</body>
<script th:inline="javascript">
    function addForm() {
        document.getElementById("projectId").value = '';
        document.getElementById("projectName").value = '';
        document.getElementById("projectState1").checked = true;
        document.getElementById("projectState2").checked = false;
        document.getElementById("teamId").value = '';
        document.getElementById("stuNo").value = '';
        // 指导老师下拉列表
        $("#selects").prop("selected", true);
        document.getElementById('projectId').readOnly = false;
    }

    function editForm(projectId, projectName, projectState, teamId, stuNo, instructorId,
                      approvalStateOne, evaluateStateOne, approvalStateTwo, evaluateStateTwo, stateNow) {
        document.getElementById("projectId").value = projectId;
        document.getElementById("projectName").value = projectName;
        // 竞赛类型
        if(projectState == 1){
            document.getElementById("projectState1").checked = true;
            document.getElementById("projectState2").checked = false;
        }else {
            document.getElementById("projectState1").checked = false;
            document.getElementById("projectState2").checked = true;
        }
        document.getElementById("teamId").value = teamId;
        document.getElementById("stuNo").value = stuNo;
        document.getElementById("evaluateStateOne").value = evaluateStateOne;
        document.getElementById("evaluateStateTwo").value = evaluateStateTwo;
        // 所属部门下拉列表
        $("#" + instructorId).prop("selected", true);
        document.getElementById('projectId').readOnly = true;

        // 设置禁用
        document.getElementById('projectId').readOnly = true;
        document.getElementById('projectName').readOnly = true;
        $("input[name=projectState]").attr("disabled", "false");
        document.getElementById('teamId').readOnly = true;
        document.getElementById('stuNo').readOnly = true;
        document.getElementById('evaluateStateOne').readOnly = true;
        document.getElementById('evaluateStateTwo').readOnly = true;
        $('#instructorId').attr("disabled","disabled");

        // 根据审核流程进行进度判断
        var successPro = document.getElementById('successPro');
        var errorPro = document.getElementById('errorPro');
        var nowLabel = document.getElementById("nowLabel");
        if(approvalStateOne == null){
            // 代表项目刚刚成立
            // 修改进度条内容
            successPro.style.cssText = 'width:33.33%;';
            errorPro.style.cssText = 'width:0%;';
            // 修改文本值
            nowLabel.innerHTML="项目刚刚成立，请等待审批";
        }else {
            // 已经成立项目进行操作判断
            if(approvalStateOne == 1){ // 指导老师审批通过
                // 修改进度条内容
                successPro.style.cssText = 'width:66.66%;';
                // 判断学院部门是否审批
                if(approvalStateTwo == null){
                    // 修改进度条内容
                    errorPro.style.cssText = 'width:0%;';
                    // 修改文本值
                    nowLabel.innerHTML="指导老师审批成功，等待学院部门审批";
                }else {
                    if(approvalStateTwo == 1){ // 学院部门审批成功，通过
                        // 修改进度条内容
                        successPro.style.cssText = 'width:100%;';
                        errorPro.style.cssText = 'width:0%;';
                        // 修改文本值
                        nowLabel.innerHTML="指导老师审批成功，学院部门审批成功";
                    }else if(approvalStateTwo == 2){ // 学院部门审批拒绝，截止
                        // 修改进度条内容
                        errorPro.style.cssText = 'width:33.33%;';
                        // 修改文本值
                        nowLabel.innerHTML="指导老师审批成功，学院部门拒批";
                    }
                }
            }else if(approvalStateOne == 2){ // 指导老师审批拒批，直接截止
                // 修改进度条内容
                successPro.style.cssText = 'width:33.33%;';
                errorPro.style.cssText = 'width:33.33%;';
                // 修改文本值
                nowLabel.innerHTML="项目已经成立，指导老师拒批";
            }
        }

        // 打印
        document.getElementById('daYin').onclick =function() {

            var oldHtml = $("#form-body-pdf").innerHTML;
            var printbox = $("#form").innerHTML;
            // 隐藏页面内容
            document.getElementById("nowBody").style.visibility="hidden";//隐藏

            $("#form").innerHTML = printbox;
            window.print();
            $("#form-body-pdf").innerHTML = oldHtml;

            // 显示页面内容
            document.getElementById("nowBody").style.visibility="visible";//显示

        }

    }

    // 审批
    function approvalForm(projectId, key) {
        document.getElementById("projectIdApproval").value = projectId;
        // 设置禁用
        document.getElementById('projectIdApproval').readOnly = true;

        // 判断类型
        if(key == "1002"){
            document.getElementById("approvalState").value = 9;
            // 设置禁用
            document.getElementById('approvalState').readOnly = true;
        }else if(key == "1003"){
            document.getElementById("approvalState").value = 8;
            // 设置禁用
            document.getElementById('approvalState').readOnly = true;
        }
    }

    // 预算详情
    function editFormFunds(projectId) {
        // 获取项目经费详情内容
        var fundsList = [[${fundsList}]];
        console.log("fundsList = " + fundsList);
        var keyName = 0;
        for(var i=0; i<fundsList.length; i++){
            console.log("fundsList[i].projectId = " + fundsList[i].projectId + ", projectId = " + projectId);
            if(fundsList[i].projectId == projectId){
                console.log("fundsList[i] = " + fundsList[i]);
                // 修改
                document.getElementById("fundsId").value = fundsList[i].fundsId;
                document.getElementById("projectIdFunds").value = fundsList[i].projectId;
                // 预算方案的下拉列表
                $("#" + fundsList[i].budgetId).prop("selected", true);
                document.getElementById("moneyOne").value = fundsList[i].moneyOne;
                document.getElementById("moneyTwo").value = fundsList[i].moneyTwo;
                document.getElementById("moneyThree").value = fundsList[i].moneyThree;
                document.getElementById("moneyFour").value = fundsList[i].moneyFour;
                document.getElementById("moneyFive").value = fundsList[i].moneyFive;
                document.getElementById("moneySix").value = fundsList[i].moneySix;
                document.getElementById("moneyOther").value = fundsList[i].moneyOther;
                document.getElementById("moneyAll").value = fundsList[i].moneyAll;
                document.getElementById("fundsMoney").value = fundsList[i].fundsMoney;
                document.getElementById("fundsNowMoney").value = fundsList[i].fundsNowMoney;
                // 禁用
                $('#budgetId').attr("disabled","disabled");
                document.getElementById('fundsId').readOnly = true;
                document.getElementById('projectIdFunds').readOnly = true;
                document.getElementById("moneyOne").readOnly = true;
                document.getElementById("moneyTwo").readOnly = true;
                document.getElementById("moneyThree").readOnly = true;
                document.getElementById("moneyFour").readOnly = true;
                document.getElementById("moneyFive").readOnly = true;
                document.getElementById("moneySix").readOnly = true;
                document.getElementById("moneyOther").readOnly = true;
                document.getElementById("moneyAll").readOnly = true;
                document.getElementById('fundsMoney').readOnly = true;
                document.getElementById('fundsNowMoney').readOnly = true;

                keyName = 1;
            }
        }
        if(keyName == 0){
            // 新增
            var timestamp = new Date().getTime();
            console.log("timestamp = " + timestamp);
            var mun = parseInt(Math.random()*900 + 100) + "";
            console.log("mun = " + mun);
            document.getElementById("fundsId").value = 'YSJF' + timestamp + mun;

            document.getElementById("projectIdFunds").value = projectId;
            // 预算方案的下拉列表
            $("#selectBudget").prop("selected", true);
            document.getElementById("moneyOne").value = '';
            document.getElementById("moneyTwo").value = '';
            document.getElementById("moneyThree").value = '';
            document.getElementById("moneyFour").value = '';
            document.getElementById("moneyFive").value = '';
            document.getElementById("moneySix").value = '';
            document.getElementById("moneyOther").value = '';
            document.getElementById("moneyAll").value = '';
            document.getElementById("fundsMoney").value = '';
            document.getElementById("fundsNowMoney").value = 0;
            // 禁用
            document.getElementById('fundsId').readOnly = true;
            document.getElementById('projectIdFunds').readOnly = true;
            document.getElementById('fundsMoney').readOnly = true;
            document.getElementById('fundsNowMoney').readOnly = true;
            // 解禁
            $("#selectBudget").prop("selected", true);

            // 设置名称
            document.getElementById('nameFunds').innerHTML = "请补加立项预算方案!";
        }
    }
</script>
<script th:inline="javascript">
    window.onload=function(){
        var result = [[${session.result}]];
        switch (result) {
            case "addTrue":
                Message('success', '√ -添加成功!!!', 2000);
                break;
            case "addFalse":
                Message('error', 'x -添加失败,已存在该用户!!!', 2000);
                break;
            case "editTrue":
                Message('success', '√ -修改成功!!!', 2000);
                break;
            case "editFalse":
                Message('error', 'x -修改失败!!!', 2000);
                break;
            case "deleteTrue":
                Message('success', '√ -删除成功!!!', 2000);
                break;
            default:
                break;
        }
        if(0 == "[[${pages}]]"){
            Message('error', '数据数量为零!!!', 2000);
        }

    };
</script>
</html>
